/* fade */
.fade-enter-active,
.fade-leave-active {
  transition:
    opacity 0.5s cubic-bezier(0.4, 0, 0.2, 1),
    background-color 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

.fade-enter {
  opacity: 0;
  background-color: transparent;
}

.fade-leave-active {
  opacity: 0;
  background-color: rgba(255, 255, 255, 0); /* 渐变到完全透明 */
}
/* gradual */
.gradual--move,
.gradual-leave-active,
.gradual-enter-active {
  transition:
    opacity 0.5s cubic-bezier(0.4, 0, 0.2, 1),
    transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

.gradual-enter {
  opacity: 0;
  transform: translateX(-4px);
}

.gradual-leave-to {
  opacity: 0;
  transform: translateX(4px);
}
